<!DOCTYPE html>
<html>
<head>
	<title>购物车</title>
	<meta charset="UTF-8">
	<link rel="stylesheet" type="text/css" href="/css/index.css">
</head>
<body>
	<!-- 导航 -->
	<header class="navbar">
	    <div class="nav-info">
            <a href="index.html">首页</a>
            <a href="page/goods.html">二手商品</a>
<!--            <a href="request.html">求购区</a>		-->
			<a class="username" href="page/personal/information.html">用户</a>
			<a class="goodsshelf" href="register.html">||&nbsp;&nbsp;&nbsp;注册</a>
			<a class="goodshelf" href="cart.html">||&nbsp;&nbsp;&nbsp;我的购物车</a>
			<a class="logout" href="register.html">[ 退 出 ]</a>
		</div> <!-- nav-info -->	
		
		<form class="nav-search">
            <a><img class="logo" src="../image/cart.jpg"></a>
			<div class="search-form">
				<a class="search-logo">| &nbsp;<img src="../image/search.png"></a>
				<input type="search" class="searchIn" placeholder="搜二手物品...">
				<button class="searchBtn">搜索</button>
			</div>
		</form><!--  nav-search -->

	</header>

		<!-- 商品 -->
		<div id="container">
			<div class="goods-part" id="book">
				<h3 class="goods-title">
                    <a href="#">二手物品</a>		
                    <a id="upload" href="page/goods.html">添加购物车</a>
                </h3>
				<ul class="goods-lists">
					<li class="goods-list">
						<a href="#" class="goods-pic">
							<img src="../image/book.jpg">
						</a>
						<a href="#" class="goods-info">
							<h5 class="goods-name">计算机组成原理</h5>
							<span class="goods-detail">唐朔飞 著 第二版</span>
						</a>
						<span class="goods-price">￥12.9
							<a href="#" class="goods-buy">立即下单</a>
						</span>
					</li>
	
					<li class="goods-list">
						<a href="#" class="goods-pic">
							<img src="../image/book1.jpg">
						</a>
						<a href="#" class="goods-info">
							<h5 class="goods-name">计算机网络</h5>
							<span class="goods-detail">谢希仁 著 第七版</span>
						</a>
						<span class="goods-price">￥13.8
							<a href="#" class="goods-buy">立即下单</a>
						</span>
					</li>			
				</ul><!--  goods-list end -->
			</div><!--  goods-part end -->
		</div>

		

	<footer>
		<a href="#">©2021-7 二手物品交易</a>
		<a href="#">意见反馈&nbsp;&nbsp;&nbsp;联系我们&nbsp;&nbsp;&nbsp;隐私权声明&nbsp;&nbsp;&nbsp;使用条款</a>
	</footer>
	<script type="text/javascript" src="../js/jquery-3.2.js"></script>
	<script type="text/javascript" src="../js/xSlider.js"></script>
	<script type="text/javascript">
		$(function(){

			$(".goods-class li a").on("click",function(){
				var classId = $(this).prop("title");
				console.log(classId);
				var classTop =  $("#container").find(("#"+classId)).offset().top; 
				$("html,body").animate({scrollTop:classTop+ "px"}, 500);
			});
		})		
	</script>
</body>
</html>